import React from 'react';
import { Button } from 'antd-mobile';
import styles from './index.less'

const RadioButton = React.forwardRef(({ dataSource = [], value, onChange, ...rest }, ref) => {
    const handleChange = v => {
        onChange(v);
    };

    return (
        <div ref={ref} {...rest}
            className={styles.checkboxButtonCtr}>
            {dataSource.map(item => (
                <Button
                    key={item.value}
                    className={styles.checkboxButton}
                    type={item.value === value ? 'primary' : 'null'}
                    size="small"
                    inline
                    onClick={() => handleChange(item.value)}>{item.name}</Button>
            ))}
        </div>
    );
});

export default RadioButton;
